<template>
    <div class="banner">
        <div class="login-wrapper">
            <!-- 登录方式 -->
            <a-tabs default-active-key="password" class="login-tabs">
                <a-tab-pane key="password" tab="账号密码登录">
                    <login-form />
                </a-tab-pane>
                <a-tab-pane key="code" tab="扫码登陆">
                    <h1>未开发</h1>
                </a-tab-pane>
            </a-tabs>
        </div>
    </div>
</template>

<script>
    import LoginForm from './LoginForm';
    export default {
        components : { LoginForm }
    };
</script>
<style scoped>
    .banner{
        height: 430px;
        min-width: 1000px;
        position: relative;
        background: #0247a4 center center no-repeat url(//cjlgb-design-oauth.cdn.bcebos.com/images/login-banner.jpg);
        margin-bottom: 60px;
    }
    .login-wrapper{
        position: absolute;
        width: 1000px;
        height: 430px;
        left: 50%;
        top: 0;
        margin-left: -500px;
    }
    /* 登录方式 */
    .login-tabs{
        position: absolute;
        right: 40px;
        top: 50%;
        margin-top: -160px;
        background: rgb(255, 255, 255);
        width: 420px;
        padding: 15px 25px 0;
    }
</style>
